<template>
  <div class="jcqk-root">
    <base-filed-detail :submit-data-action="submitDataAction" :mid="mid" :title="title" :query-list-action="queryListAction" :rules="rules"
                       :load-list-before="loadListBefore" :view-field="viewField" :formFiled="formFiled" :submitBeforeAction="submitBeforeAction">

      <template v-slot:form-item>
        <el-form-item label="成活率" prop="rateSurvival">
          <el-input type="number" v-model="formFiled.rateSurvival"></el-input>
        </el-form-item>
        <el-form-item label="返青率" prop="greenRate">
          <el-input type="number" v-model="formFiled.greenRate"></el-input>
        </el-form-item>
      </template>
    </base-filed-detail>
  </div>
</template>

<script>
  import { reactive, toRefs, onMounted, ref, watch, computed } from '@vue/composition-api'
  import baseFiledDetail from '../components/baseFiledDetail'
  import { getInfo, updateFilInfo } from '@/api/industry/cpf'
  import uploadImage from '@/components/UploadImage'

  export default {
    name: 'jcqk',
    props: {
      mid: {
        type: [String, Number],
        default: null
      }
    },
    components: {
      uploadImage,
      baseFiledDetail
    },
    setup(props, content) {
      const getInfoData = () => {
        return getInfo(props.mid)
      }

      let data = reactive({
        formFiled: {
          rateSurvival: null,
          greenRate: null
        },
        queryListAction: getInfoData,
        submitDataAction: updateFilInfo,
        title: '建成情况',
        rules: {},
        viewField: [
          { label: '成活率', field: 'rateSurvival' },
          { label: '返青率', field: 'greenRate' }
        ]

      })
      const submitBeforeAction = (requestData) => {
        let req = JSON.parse(JSON.stringify(requestData))
        req.id = props.mid
        return req
      }

      const loadListBefore = async(response) => {
        if (response.data.rateSurvival == null && response.data.greenRate == null) {
          response = await new Promise((resolve, reject) => {
            response.rows = [resolve(response)]
          })
          return response
        }
        response = await new Promise((resolve, reject) => {
          let { rateSurvival, greenRate } = response.data
          response.rows = [{ rateSurvival, greenRate }]
          resolve(response)
        })
        return response
      }

      return { ...toRefs(data), submitBeforeAction, loadListBefore }
    }
  }
</script>

<style scoped lang="scss">
  .jcqk-root {

  }
</style>
